$(function() {
		$('#svgContainer').svg({onLoad: null});
		$('#addnode').click(addNode);
		$('#addnode_ani').click(addNode_ani);
		$('#clear').click(function() {
			$('#svgContainer').svg('get').clear();
			root = null;
			nodeCount = 0;
			$('#note').text('Cleared!');
		});
	});

	var nodeCount = 0;
	var root = null;

	function treeNode(val) {
		this.value = val;
		this.x = 0;
		this.y = 0;
		this.w = 0;
		this.pnode = null;
		this.lnode = null;
		this.rnode = null;
		this.circle = null;
		this.text = null;
	}

	function drawNode(node) {
		if (node.value<10){
			node.w = 5;
		}
		else if (node.value<100){
			node.w = 10;
		}
		else {
			node.w = 15;
		}
		var svg = $('#svgContainer').svg('get');
		var g = svg.group({fontWeight: 'bold', fontSize: '20', fill: 'black'});
		node.circle = svg.circle(node.x, node.y, 20, {fill: 'none', stroke: 'black', strokeWidth: 2});
		node.text = svg.text(g, node.x-node.w, node.y+6, String(node.value)); 
	}

	function drawLine(node1,node2) {
		var svg = $('#svgContainer').svg('get');
		var g = svg.group({stroke: 'black', strokeWidth: 2}); 
		svg.line(g, node1.x, node1.y+20, node2.x, node2.y-20); 
	}

	function addNode(){
		if (!$('#inputbox').val()) return;
		var tmpval = parseInt($('#inputbox').val())
		if (nodeCount==0) {
			root = new treeNode(tmpval);
			root.x = $('#svgContainer').width()/2;
			root.y = 50;
			drawNode(root);
			$('#note').text(tmpval + ' added! (root)');
		}
		else {
			var tmp = root;
			var tmpdis = root.x/2;
			while (true) {
				if (tmpval > tmp.value) {
					if (tmp.rnode == null) {
						tmp.rnode = new treeNode(tmpval);
						tmp.rnode.x = tmp.x + (tmpdis + 50)/2;
						tmp.rnode.y = tmp.y + 75;
						if (tmp.rnode.y > $('#svgContainer').height()) {
							$('#note').text('Out of sight!');
						}
						else {						
							drawNode(tmp.rnode);
							drawLine(tmp, tmp.rnode);
							$('#note').text(tmpval + ' added!');
						}
						break;
					}
					else tmp = tmp.rnode;
				}
				else if (tmpval < tmp.value) {
					if (tmp.lnode == null) {
						tmp.lnode = new treeNode(tmpval);
						tmp.lnode.x = tmp.x - (tmpdis + 50)/2;
						tmp.lnode.y = tmp.y + 75;
						if (tmp.lnode.y > $('#svgContainer').height()) {
							$('#note').text('Out of sight!');
						}
						else {
							drawNode(tmp.lnode);
							drawLine(tmp, tmp.lnode);
							$('#note').text(tmpval + ' added!');
						}
						break;
					}
					else tmp = tmp.lnode;
				}
				else {
					$('#note').text(tmpval + ' already exists!');
					break;
				}
				tmpdis = tmpdis/2;
			}
		}
		nodeCount++;
		$('#inputbox').val('');
	}

	function move(node, X, Y) {
		$(node.circle).animate({svgCx: X, svgCy: Y}, 1000);
		$(node.text).animate({svgX: X - node.w, svgY: Y+6}, 1000);
		node.x = X;
		node.y = Y;
	}


	function addNode_ani(){
		if (!$('#inputbox').val()) return;
		var tmpval = parseInt($('#inputbox').val())
		if (nodeCount==0) {
			root = new treeNode(tmpval);
			root.x = $('#svgContainer').width()/2;
			root.y = 0;
			drawNode(root);
			move(root, $('#svgContainer').width()/2, 50);
			$('#note').text(tmpval + ' added! (root)');
		}
		else {
			var tmp = root;
			var tmpdis = root.x/2;
			var tmpnode = new treeNode(tmpval);
			tmpnode.x = $('#svgContainer').width()/2;
			tmpnode.y = 0;
			drawNode(tmpnode);
			
			while (true) {
				if (tmpval > tmp.value) {
					if (tmp.rnode == null) {
						tmp.rnode = new treeNode(tmpval);
						tmp.rnode.x = tmp.x + tmpdis;
						tmp.rnode.y = tmp.y + 75;
						if (tmp.rnode.y > $('#svgContainer').height()) {
							$('#note').text('Out of sight!');
						}
						else {
							move(tmpnode, tmp.rnode.x, tmp.rnode.y);
							drawLine(tmp, tmp.rnode);
							$('#note').text(tmpval + ' added!');
						}
						break;
					}
					else {
						tmp = tmp.rnode;
						move(tmpnode, tmp.x, tmp.y-50);
					}
				}
				else if (tmpval < tmp.value) {
					if (tmp.lnode == null) {
						tmp.lnode = new treeNode(tmpval);
						tmp.lnode.x = tmp.x - tmpdis;
						tmp.lnode.y = tmp.y + 75;
						if (tmp.lnode.y > $('#svgContainer').height()) {
							$('#note').text('Out of sight!');
						}
						else {
							move(tmpnode, tmp.lnode.x, tmp.lnode.y );
							drawLine(tmp, tmp.lnode);
							$('#note').text(tmpval + ' added!');
						}
						break;
					}
					else {
						tmp = tmp.lnode;
						move(tmpnode, tmp.x, tmp.y-50);
					}
				}
				else {
					tmpnode.circle.remove();
					tmpnode.text.remove();
					$('#note').text(tmpval + ' already exists!');
					break;
				}
				tmpdis = tmpdis/2;
			}
		}
		nodeCount++;
		$('#inputbox').val('');
	}

	function isNumberKey(evt){
	    var charCode = (evt.which) ? evt.which : event.keyCode
	    if (charCode > 31 && (charCode < 48 || charCode > 57))
	        return false;
	    return true;
	}